<template>
	<view class="content">
		<z-paging ref="paging" v-model="dataList" @query="queryList" :use-page-scroll="true">
			<!-- 切换展示的内容 -->
			<view class="change_content">
				<BsinForum v-for="(item,index) in dataList" :item="item" @action="doAction" :key="index"
					:class="{'special_style':index===dataList.length - 1}" @detailAction="showDetailAction(item)">
				</BsinForum>
				<BsinFab @publish="doPublish"></BsinFab>
			</view>
		</z-paging>
	</view>
</template>

<script>
	import {
		getOpinionPageList
	} from '@/config/opinion.js';
	import {
		getForumPageList
	} from '@/config/forum.js';
	import {
		getActivityPageList
	} from '@/config/activity.js';
	export default {
		data() {
			return {
				dataList: [],
				tenantId: '',
				token: "",
				list1: [{
					name: '最新',
				}, {
					name: '精选',
				}],
				topShowType: 0, // 控制顶部的展示类型
			}
		},
		onTabItemTap(e) {
			// tab 点击时执行，此处直接接收单击事件
			console.log("tab 点击时执行，此处直接接收单击事件")
		},
		//监听原生导航栏按钮点击事件
		onNavigationBarButtonTap(e){
			console.log("监听原生导航栏按钮点击事件")
		},
		onShow() {
			this.token = uni.getStorageSync('token');
			this.$refs.paging.reload()
		},
		async onLoad({
			tenantId
		}) {
			this.tenantId = tenantId
			console.log(tenantId)
		},

		methods: {
			showDetailAction(item) {
				uni.navigateTo({
					url: '/pages/Dao/DaoForumDetail?serialNo=' + item.serialNo
				})
			},

			queryList(pageNo, pageSize) {
				let daoId = this.tenantId;
				if (this.topShowType == 0) {
					getForumPageList({
						tenantId: daoId
					}).then(res => {
						this.$refs.paging.complete(res.data);
					})
				} else {
					getForumPageList({
						tenantId: daoId
					}).then(res => {
						this.$refs.paging.complete(res.data);
					})
				}

			},

			goToDaoDetail(serialNo) {
				uni.navigateTo({
					url: `/pages/Home/DaoDetail?serialNo=${serialNo}`
				})
			},
			goToActivityDetail(serialNo) {
				uni.navigateTo({
					url: `/pages/Home/ActivityDetail?serialNo=${serialNo}`
				})
			},

			// 顶部模块的改变
			changeTopModule({
				index
			}) {
				this.topShowType = index
				this.$refs.paging.reload()
			},

			changeDaoTab({
				index
			}) {
				// 根据不同类型查询dao数据
				console.log(index)
				getDaoPageList({
					type: index.toString()
				}).then(res => {
					this.$refs.paging.complete(res.data);
				})
			},
			// 去dao展示页
			goToDao() {
				uni.navigateTo({
					url: `/pages/Home/DaoDetail`
				})
			},

			// 点击操作菜单
			doAction(e) {
				uni.showActionSheet({
					itemList: ['点赞', '评论'],
					success: res => {
						if (res.tapIndex === 0) {
							console.log('点赞操作');
						} else {
							console.log('评论操作');
						}
					},
				});
			},

			// 发布
			doPublish() {
				if (!this.token) {
					uni.$u.toast('请先登陆')
					return
				}
				uni.navigateTo({
					url: "/pages/Dao/PublishForum?tenantId=" + this.tenantId
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.uTabsNav {
		display: flex !important;
		padding-bottom: 5px;
		justify-content: space-around !important;
	}

	// 去掉列表最后一个border-bottom
	.special_style {
		border-bottom: none !important;
	}

	// 公共头像样式
	.avatar {
		border-radius: 50%;
		width: 90rpx;
		height: 90rpx;
		border: 1px solid #ddd;
		overflow: hidden;
	}

	.app_top {
		height: 200rpx;
	}

	.content {

		.top_bar {
			background-color: #fff;
		}

		// 顶部安全距离
		.status_bar {
			height: var(--status-bar-height);
		}

		// swiper展示区域
		.swiper_item,
		.banner_img {
			width: 100%;
			height: 100%;
		}

		// dao展示区域
		.dao_card {
			box-shadow: 4px 4px 26px 6px rgba(0, 0, 0, 0.08);
			border-radius: 1rem;
			height: 360rpx;
			padding: 30rpx;
			margin: 30rpx 30rpx;

			.title {
				display: flex;
				align-items: center;

				&_logo {
					width: 100rpx;
					height: 100rpx;
					margin-right: 30rpx;
					border-radius: 50%;
					overflow: hidden;

					image {
						width: 100%;
						height: 100%;
					}
				}

				&_text {
					font-size: $echo-font-size-title;
				}
			}

			.description {
				margin: 20rpx 0 20rpx 0;
				height: 156rpx;
				line-height: 40rpx;
				overflow: hidden;
				text-overflow: ellipsis;
			}

			.other {
				color: #999;

				.type,
				.link {
					display: flex;
					align-items: center;
					font-size: 24rpx;

					.tag,
					.tolink {
						margin-left: 24rpx;
						display: flex;
						align-items: center;
					}

				}

				.link {
					margin-top: 10rpx;

					.icon {
						margin-right: 10rpx;
					}
				}
			}
		}

		// activity展示区域
		.activity_card {
			box-shadow: 4px 4px 26px 6px rgba(0, 0, 0, 0.08);
			border-radius: 1rem;
			padding: 30rpx;
			margin: 30rpx 30rpx;

			.title {
				display: flex;
				align-items: center;

				&_logo {
					width: 100rpx;
					height: 100rpx;
					margin-right: 30rpx;
					border-radius: 50%;
					overflow: hidden;

					image {
						width: 100%;
						height: 100%;
					}
				}

				&_text {
					font-size: $echo-font-size-title;
				}
			}

			.description {
				margin: 20rpx 0 20rpx 0;
				line-height: 40rpx;
			}

			.other {
				color: #999;

				.type,
				.link {
					display: flex;
					align-items: center;
					font-size: 24rpx;

					.tag,
					.tolink {
						margin-left: 24rpx;
						display: flex;
						align-items: center;
					}

				}

				.link {
					margin-top: 10rpx;

					.icon {
						margin-right: 10rpx;
					}
				}
			}
		}
	}
</style>
